<!DOCTYPE html>
<head>
    <title>空间</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=750,user-scalable=no,target-densitydpi=device-dpi">
    <script src="js/jquery-1.11.2.min.js"></script>
    <style type="text/css">
        .memuList{height: auto;padding: 20px 0;}
        .memuList .tab{padding: 0;}
    </style>
    <script type="text/javascript">
        document.write('<link rel="stylesheet" href="css/style.css?time='+new Date().getTime()+'">');
        document.write('<script type="text/javascript" src="js/main.js?time='+new Date().getTime()+'"><\/script>');
    </script>
    <script type="text/javascript">
        var totalpage=pn=1;
        var ps=10;
        var province_id = 0;
        getData(pn,province_id);

        function tabChange(obj){
            $(obj).addClass("cur").siblings().removeClass("cur");
            $(".cityGroup").html("");
            province_id = $(obj).attr("province_id");
            if( !province_id ) province_id = 0;
            pn = 1;
            getData(pn,province_id);
        }

        $(function(){
            $.ajax({
                type: "get",
                url: requestUrl+'_app/cities',
                dataType:'json',
                data:{  },
                success: function(data) {
                    var citiesStr='';
                    $.each(data.data,function(index,value){
                        citiesStr+='<li province_id="'+value.city_id+'" onclick="tabChange(this)">'+value.city_name+'</li>';
                    });
                    $(".tab").append(citiesStr);
                }
            })

        })

        function getData(pn,province_id){
            //console.log(pn);
            $.ajax({
                type: "get",
                url: requestUrl+'_space/space_list',
                dataType:'json',
                data:{
                    pn:pn,
                    ps:ps,
                    city_id:province_id
                },
                success: function(data) {
                    totalpage=data.data.totalPage;
                    var str='';
                    if(data.data.list.length == 0){
                        return;
                    }
                    $.each(data.data.list,function(index,value){
                        str+='<div class="spaceMore"> <div class="group"><div class="picCon"><img src="'+value.displayPicture+'"></div><h3>'+value.spaceName+'</h3><p>'+value.address+'</p><a href="'+requestUrl+value.detailUrl+"&wx=1"+'" class="view">查看</a></div></div>';
                    });
                    $(".cityGroup").append(str);
                    $('img').error(function(){
                        $(this).attr('src', "images/1.png");
                    });
                    if (pn >= totalpage) return false;
                    else{
                        pn++;
                        getData(pn,province_id);
                    }
                }
            });
        }
    </script>
</head>
<body style="background: #fff;">
<div class="box">
    <div class="space">
        <div class="memuList" style="display: none;">
            <ul class="tab">
                <li class="cur" onclick="tabChange(this)">全部</li>
            </ul>
        </div>

        <div class="room">
            <div class="cityGroup on">
            </div>
            <!--  -->
        </div>
        <!--  -->
    </div>
</div>
</body>
</html>